import React from 'react';
import styles from './index.less';
import RegionModal from '../RegionModal';
import HeaderData from '../HeaderData';
import { AlertResult } from '#/utils/contacts.js';
import { CaretDownOutlined } from '#/utils/antdIcons';
import PropTypes from 'prop-types';
import RHeaderData from '@/pages/RevenueAnalysis/HeaderData';
const ModuleHeader = ({ title, children, region = {}, revenueAnalysis, revenueAnalysisData }) => {
  return (
    <>
      <div className={`${styles.title} ${revenueAnalysis ? styles.revenueAnalysisTitle : ''}`}>
        <p className={styles.textOne}>{title}</p>
        {children}
        {region.show ? <Region {...region} revenueAnalysis={revenueAnalysis} /> : null}
        {/* <div className={styles.textTwo}></div> */}
      </div>
      {revenueAnalysis ? <RHeaderData {...revenueAnalysisData} /> : <HeaderData />}
    </>
  );
};

const Region = ({ regionData, selectRegion, setRegion, code, revenueAnalysis }) => {
  const _onGetRegion = async () => {
    let result = await RegionModal.show({ regionData, selectRegion, code, revenueAnalysis });
    if (result.index === AlertResult.SUCCESS) {
      setRegion(result.selectData);
    }
  };
  return (
    <div style={{ cursor: 'pointer' }} className={styles.regions} onClick={_onGetRegion}>
      区域：{selectRegion.length ? `已选${selectRegion.length}项` : '全部'} <CaretDownOutlined />
    </div>
  );
};

ModuleHeader.propTypes = {
  region: PropTypes.object,
  children: PropTypes.node,
  title: PropTypes.string,
};

Region.propTypes = {
  regionData: PropTypes.array,
  selectRegion: PropTypes.array,
  setRegion: PropTypes.func,
  code: PropTypes.string,
};

export default ModuleHeader;
